Hey教你∣使用GeoHey SDK开发地图应用的那些小技巧（四）

Blog地址 | http://blog.geohey.com/shi-yong-de-geohey-sdkkai-fa-di-tu-ying-yong-de-na-xie-xiao-ji-qiao-si/

文章  |  灰羽

编辑  |  Kelly

在实现比较复杂的地图项目中，我们需要在地图上叠加大量而且种类不同的图层。并且这些图层还要处于显示／隐藏、编辑、绘制等不同的状态。在这一期内容中，我们将围绕“图层管理”这个目标，一步步满足这些需求。

首先，我们的图层不仅与多个，而且包含了切片图层、矢量图形图层或绘制图层等多个种类的图层。那么，我们先来定义一下当前的地图和图层们。

在添加图层时，我们在创建map对象后，首先添加baseMapLayer，添加graphicLayer和drawLayer这两个用于编辑和绘制的图层，最后将4个tileLayer类型的切片图层添加进来。这个时候，我们的默认图层顺序如下：

0－－baseMapLayer

1－－graphicLayer

2－－drawLayer

3－－tileLayer1

4－－tileLayer2

5－－tileLayer3

6－－tileLayer4

我们可以还将创建好的图层，存储到一个全局定义的数组中，例如：

按照顺序，将图层对象push到layerList数组中，这样，我们的准备工作就完成了。接下来，根据不同的操作的需求，我们将进行不同的处理。

1.更换底图

当我们需要更换底图时，如果更换的底图和现有的底图，在cluster等参数上一致，那么可以直接通过setUrl来更新，示例如下：

如果参数并不一致，那么需要将baseMapLayer图层移除后，重新加入进来。

注1.这里默认是按照上面的默认图层顺序来设置 

注2:按照默认图层顺序，可以使用bringToBottom()替代bringToOrder(0)，将baseMapLayer移动到最下层。但是如果baseMapLayer在默认图层顺序中，不在最下层，则只能使用bringToOrder方法来调整顺序。

2.编辑graphicLayer中的内容

如果我们要编辑graphicLayer中的内容，无论是选中要素还是编辑要素的几何形状，都需要我们首先将该图层移动到最上层。

注3.如果使用了全局的layerList，请不要忘记调整layerList中graphicLayer的index。

在graphicLayer移动到最上层后，我们就可以进行编辑操作了。在完成编辑后，我们将graphicLayer移动回原来的顺序位置

这里也可以使用bringToBottom后，再使用bringToTop，可以达成同样的效果。但是这样做，不仅操作很繁琐，而且如果图层原本的顺序索引较大，那么中间移动的步骤不仅多，造成图层顺序混乱的机会也会成倍增长。

3.绘制要素

绘制要素时，对图层的操作和graphicLayer类似：

4.调整切片图层顺序

当地图中只有切片图层时，调整切片图层顺序，只是用bringToTop和bringToBottom方法就足够了。但我们的图层更多，更复杂。因此只是用上面的2个方法，就无法满足我们的要求了。

在我们这个示例中，4个tileLayer下面，还有着baseMapLayer、graphicLayer和drawLayer这三个图层。因此，在调整切片图层顺序前，首先要确定，我们要移动的这个图层，是否是我们切片图层组中的上下边界（在本示例中，图层索引3和6）。

当目标图层是切片图层组中的最下层时，应当禁止其进行向下移动操作；当它是切片图层组中的最上层时，应当禁止其进行向上移动操作。 之后在调整时，如果一次操作只上移／下移一个图层，那么可以使用bringToTop和bringToBottom来完成。但是当变动的值大于1时，建议使用bringToOrder来完成。同时要注意，移动后的图层索引值是否会超过边界。

5.交换图层

通过一些组件，我们可以在界面上实现拖动交换功能。在图层层面，实现起来会略有点复杂。我们这里来简单实现一下4个切片图层之间的拖动交换操作。 首先，我们需要两个List，一个记录图层的信息，另一个记录插入map对象中的实际的图层。

可以看到，这里我们将tileLayer1和tileLayer3进行了交换。这里我们将所有的图层进行重排列。

这样虽然能实现，但是明显过于简单粗暴。我们将上面的方法优化一下

到这里，比较基本的图层管理的需求，我们就都可以满足了。

－－－－我是每次都会出现的footer－－－－

对我们的SDK在使用上有问题的同学，可以先访问我们的示例页面，在其中进行在线调试。如果依然有问题，也可以关注我们的公众号，或是加入我们的QQ交流群（164183186）。

GeoHey

地理位置服务领先者  

让我们一起探索地理位置的价值

为这个世界创造一个使用地图的新方式

微博ID：GeoHey

微信服务号：geohey_com

访问网站 http://geohey.com

联系&合作邮箱：[e-mail]

长按识别二维码关注

点击“阅读原文”打开新页面